import { APITtsList } from "@/api/ApiSpeechModel"
import { reactive } from "vue"

interface PaginationData {
  currentPage: number
  pageSize: number
  count: number
}

interface SoundHistoryList {
  id: number
  url: string
  messages: string
}

interface State {
  paginationData: PaginationData
  soundHistoryList: SoundHistoryList[]
  speechAudioLoading: boolean
}

/** 默认的分页参数 */
const defaultPaginationData: PaginationData = {
  currentPage: 1,
  pageSize: 20,
  count: 0
}

const state = reactive<State>({
  paginationData: { ...defaultPaginationData },
  soundHistoryList: [],
  speechAudioLoading: false
})

export default function useSpeechModel() {
  // 获取声音历史
  const soundHistory = async () => {
    state.speechAudioLoading = true
    let { data, code } = await APITtsList({ page: state.paginationData.currentPage })
    if (code === 200) {
      state.soundHistoryList = state.soundHistoryList.concat(data.list)
    }
    state.paginationData.count = data.count
    state.speechAudioLoading = false
  }

  // 滚动下一页
  const nextPage = () => {
    if (state.paginationData.currentPage < state.paginationData.count / state.paginationData.pageSize) {
      state.paginationData.currentPage += 1
      soundHistory()
    }
    console.log(state.paginationData.currentPage)
  }
  // ...
  return { nextPage, soundHistory, state }
}
